<template>
  <div class="deliver">
    <el-header height="auto">
      <m-search
        ref="SearchFormSP"
        label-width="66px"
        :data="searchParams"
        :submit-loading="submitLoading"
        @searchForm="searchForm"
        @resetForm="resetForm"
      />
      <slot />
    </el-header>
    <m-editable
      v-loading="tableLoading"
      style="margin: 0 20px"
      :empty-type="resultType"
      :data="dataList"
      height="400"
      :style="{ height: 400 + 'px' }"
      :columns="columnsTable"
    >
      <template slot="default-action" slot-scope="scope">
        <el-button
          type="primary"
          plain
          size="mini"
          :disabled="scope.row.status !== 1 && scope.row.status !== 3"
          @click.stop="toDetails(scope.row)"
        >
          {{ scope.row.status === 3 ? '重新签收' : '签收' }}
        </el-button>
        <el-button
          type="primary"
          plain
          size="mini"
          @click.stop="toDetails(scope.row)"
          >查看</el-button
        >
      </template>
    </m-editable>
    <el-pagination
      v-show="paging"
      class="pageBox"
      align="right"
      style="margin-top: 10px"
      :current-page="page.curPage"
      :page-sizes="PAGE_NUMBER"
      :page-size="page.size"
      :layout="PAGINATION_LAYOUT"
      :total="page.total"
      @size-change="sizeChange"
      @current-change="pageChange"
    />
  </div>
</template>

<script>
/* eslint-disable */

import { PAGE_NUMBER, PAGINATION_LAYOUT } from '@const/common';
import { toSentinvoiceSP } from '@api/hossyn-order-center';

export default {
  name: 'Deliver',
  props: {
    auditStatus: Number,
  },
  data() {
    return {
      PAGE_NUMBER,
      PAGINATION_LAYOUT,
      resultType: 0,
      tableLoading: false,
      columnsTable: [
        // {
        //   width: '40',
        //   fixed: 'left',
        //   type: 'selection',
        // },
        {
          type: 'index',
          label: '序号',
          width: 100,
          align: 'center',
        },
        {
          prop: 'giveApplyCode',
          label: '申请单号',
          width: 100,
          'show-overflow-tooltip': true,
        },
        {
          prop: 'giveBilingDate',
          label: '计划送票日期',
          width: 270,
          'show-overflow-tooltip': true,
          align: 'center',
        },
        {
          prop: 'customerName',
          label: '客户名称',
          minWidth: 160,
          align: 'center',
          'show-overflow-tooltip': true,
        },
        {
          prop: 'pcompanyName',
          label: '配送商',
          minWidth: 170,
          align: 'center',
          'show-overflow-tooltip': true,
        },
        {
          prop: 'invoiceNum',
          label: '发票数量',
          minWidth: 120,
          align: 'center',
        },
        {
          prop: 'applicationAmount',
          label: '发票税前总金额',
          minWidth: 120,
          align: 'center',
        },
        {
          prop: 'applicationNoTaxAmount',
          label: '发票税后总金额',
          minWidth: 120,
          align: 'center',
        },
        {
          prop: 'statusStr',
          label: '送票状态',
          minWidth: 120,
          align: 'center',
        },
        {
          prop: 'createTime',
          label: '创建时间',
          minWidth: 160,
          align: 'center',
          'show-overflow-tooltip': true,
        },
        {
          prop: 'updateTime',
          label: '最后变更时间',
          minWidth: 160,
          align: 'center',
          'show-overflow-tooltip': true,
        },

        {
          prop: 'action',
          label: '操作',
          width: 180,
          fixed: 'right',
          align: 'center',
        },
      ],
      page: {
        curPage: 1,
        pageSize: PAGE_NUMBER[0],
        total: 0,
      },
      searchData: {},
      dataList: [],
      paging: true,
      indexSearchData: [
        {
          key: 'giveApplyCode',
          title: '申请单号',
          type: 'input',
          attr: {
            placeholder: '请输入',
          },
        },
        {
          key: 'customerName',
          title: '客户名称',
          type: 'input',
          attr: {
            placeholder: '请输入',
          },
        },
        {
          key: 'invoiceNumber',
          title: '发票编号',
          type: 'input',
          attr: {
            placeholder: '请输入',
          },
        },
        {
          key: 'giveInvoice',
          title: '计划送票日期',
          type: 'time',
          fieldname: ['giveInvoiceStartTime', 'giveInvoiceEndTime'],
          attr: {
            placeholder: '请选择',
            type: 'daterange',
            'start-placeholder': '计划送票开始时间',
            'end-placeholder': '计划送票结束时间',
            'default-time': ['00:00:00', '23:59:59'],
          },
        },
        {
          key: 'create',
          title: '创建时间',
          type: 'time',
          fieldname: ['createStartTime', 'createEndTime'],
          attr: {
            placeholder: '请选择',
            type: 'daterange',
            'start-placeholder': '创建开始时间',
            'end-placeholder': '创建结束时间',
            'default-time': ['00:00:00', '23:59:59'],
          },
        },
        {
          key: 'update',
          title: '最后变更时间',
          type: 'time',
          fieldname: ['updateStartTime', 'updateEndTime'],
          attr: {
            placeholder: '请选择',
            type: 'daterange',
            'start-placeholder': '最后变更开始时间',
            'end-placeholder': '最后变更结束时间',
            'default-time': ['00:00:00', '23:59:59'],
          },
        },
      ],
      submitLoading: false,
    };
  },
  computed: {
    searchParams() {
      if (this.auditStatus === 1) {
        return [
          ...this.indexSearchData,
          {
            key: 'status',
            title: '送票状态',
            type: 'select',
            attr: {
              placeholder: '请选择',
            },
            options: [
              {
                label: '待签收',
                value: 1,
              },
              {
                label: '待审核',
                value: 2,
              },
              {
                label: '签收驳回',
                value: 3,
              },
              {
                label: '签收通过',
                value: 4,
              },
            ],
          },
        ];
      }
      return this.indexSearchData;
    },
  },
  watch: {
    auditStatus() {
      this.getList();
    },
    page: {
      deep: true,
      handler() {
        this.getList();
      },
    },
  },
  created() {
    this.getList();
  },
  methods: {
    // 搜索功能-点击查询
    searchForm(condition) {
      this.page.curPage = 1;
      this.searchData = condition;
      this.getList();
    },
    resetForm(condition) {
      this.page.curPage = 1;
      this.searchData = condition;
      this.getList();
    },
    toDetails(row) {
      this.$router.push({
        path: '/distributorSide/invoiceManagement/add',
        query: {
          giveApplyId: row.giveApplyId,
          status: row.status,
        },
      });
    },
    async getList() {
      let params = {
        ...this.searchData,
        status:
          this.auditStatus === 0 || this.auditStatus === 1
            ? ''
            : this.auditStatus - 1,
        page: this.page.curPage,
        pageSize: this.page.pageSize,
      };

      if (this.auditStatus === 1) {
        params = {
          status:
            this.auditStatus === 0 || this.auditStatus === 1
              ? ''
              : this.auditStatus - 1,
          ...this.searchData,
          page: this.page.curPage,
          pageSize: this.page.pageSize,
        };
      }

      const { data } = await this.$axios({
        url: toSentinvoiceSP,
        method: 'post',
        data: params,
      });

      this.dataList = data.payload.content || [];
      this.page.total = data.payload.totalElements;
      if (this.page.total === 0) {
        this.paging = false;
      }
    },
    // 切换不一样的页面,重置一切数据
    pageChange(curPage) {
      this.page.curPage = curPage;
    },
    // 页码更改
    sizeChange(size) {
      this.page.pageSize = size;
    },
  },
};
</script>

<style lang="less" scoped>
.deliver {
  width: 100%;
}
</style>

<style>
.gkSearchForm
  .filter-box
  .el-form-item__content
  .el-date-editor
  .el-range__icon {
  display: none;
}
</style>
